/*--- reset code ---*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
dl,
dt,
dd,
ol,
nav ul,
nav li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

ol,
ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/* start editing from here */

a {
    text-decoration: none;
}

.txt-rt {
    text-align: right;
}


/* text align right */

.txt-lt {
    text-align: left;
}


/* text align left */

.txt-center {
    text-align: center;
    /*-- W3Layouts --*/
}


/* text align center */

.float-rt {
    float: right;
}


/* float right */

.float-lt {
    float: left;
}


/* float left */

.clear {
    clear: both;
}


/* clear float */

.pos-relative {
    position: relative;
}


/* Position Relative */

.pos-absolute {
    position: absolute;
}


/* Position Absolute */

.vertical-base {
    vertical-align: baseline;
}


/* vertical align baseline */

.vertical-top {
    vertical-align: top;
}


/* vertical align top */

nav.vertical ul li {
    display: block;
}


/* vertical menu */

nav.horizontal ul li {
    display: inline-block;
}


/* horizontal menu */

img {
    max-width: 100%;
}


/*--- end reset code ---*/

body {
    margin: 0;
    padding: 0;
    background: url(../images/banner.jpg) no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
}

.clear {
    clear: both;
}


/*-- AgileITS --*/

h1 {
    text-align: center;
    font-size: 45px;
    color: #fff;
    padding: 50px 0;
    text-transform: uppercase;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
}

.log h2 {
    font-size: 40px;
    padding: 30px 0 0;
    color: #fff;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    text-align: center;
}

.log .content h2 {
    font-size: 40px;
    padding: 30px 0 0;
    color: #fff;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    text-align: center;
}

.log {
    width: 75%;
    margin: 0 auto;
}

.button-row {
    width: 100%;
    margin-top: 5%;
    padding-bottom: 40px;
}

.sign-in {
    padding: 10px;
    background-color: #4C9A39;
    width: 35%;
    border: none;
    cursor: pointer;
    color: #fff;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    font-size: 20px;
    margin-left: 62px;
    float: left;
    text-transform: uppercase;
    border-radius: 4px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.sign-in:hover {
    background-color: #376D29;
    color: #fff;
}

.reset {
    padding: 10px;
    background-color: #c0392b;
    width: 35%;
    border: none;
    /*-- AgileITS --*/
    cursor: pointer;
    color: #fff;
    font-size: 20px;
    float: right;
    margin-right: 62px;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    text-transform: uppercase;
    border-radius: 4px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.reset:hover {
    background-color: #791F16;
    color: #fff;
}

.content {
    width: 100%;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.21);
    padding: 30px 0 70px;
    border-radius: 0px;
}

.content div.error-message{
    color: crimson;
}

.content input[type="text"] {
    padding: 10px 40px 10px 10px;
    width: 70%;
    border: 1px solid white;
    color: #fff;
    text-align: left;
    outline: none;
    font-size: 18px;
    margin-top: 5%;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    border-radius: 4px;
    background-color: transparent;
    float: none;
    -moz-box-sizing: border-box;
    /*Firefox3.5+*/
    -webkit-box-sizing: border-box;
    /*Safari3.2+*/
    -o-box-sizing: border-box;
    /*Opera9.6*/
    -ms-box-sizing: border-box;
    /*IE8*/
    box-sizing: border-box;
    /*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}

.content input[type="tel"] {
    padding: 10px 40px 10px 10px;
    width: 70%;
    border: 1px solid white;
    color: #fff;
    text-align: left;
    outline: none;
    font-size: 18px;
    margin-top: 4%;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    border-radius: 4px;
    background-color: transparent;
    -moz-box-sizing: border-box;
    /*Firefox3.5+*/
    -webkit-box-sizing: border-box;
    /*Safari3.2+*/
    -o-box-sizing: border-box;
    /*Opera9.6*/
    -ms-box-sizing: border-box;
    /*IE8*/
    box-sizing: border-box;
    /*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}

.content input[type="email"] {
    padding: 10px 40px 10px 10px;
    width: 70%;
    border: 1px solid white;
    color: #fff;
    text-align: left;
    outline: none;
    font-size: 18px;
    margin-top: 4%;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    border-radius: 4px;
}

.content input[type="password"] {
    padding: 10px 40px 10px 10px;
    width: 70%;
    border: 1px solid white;
    color: #fff;
    text-align: left;
    outline: none;
    font-size: 18px;
    margin-top: 4%;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    border-radius: 4px;
    background-color: transparent;
}

.content select {
    padding: 10px 40px 10px 10px;
    width: 70%;
    border: 1px solid white;
    color: #fff;
    text-align: left;
    outline: none;
    font-size: 18px;
    margin-top: 5%;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    border-radius: 4px;
    background-color: transparent;
    -webkit-appearance: initial;
    -moz-box-sizing: border-box;
    /*Firefox3.5+*/
    -webkit-box-sizing: border-box;
    /*Safari3.2+*/
    -o-box-sizing: border-box;
    /*Opera9.6*/
    -ms-box-sizing: border-box;
    /*IE8*/
    box-sizing: border-box;
    /*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}

.content option {
    color: black;
}
.content div.result p{
    color: #fff;
    margin-top: 3%;
    margin-bottom: 1%;
    font-size: 18px;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
}
.content div.result hr{
}
.register {
    padding: 10px;
    background-color: #4C9A39;
    width: 78%;
    border: none;
    cursor: pointer;
    color: #fff;
    font-weight: 300;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    font-size: 20px;
    margin-top: 7%;
    text-transform: uppercase;
    border-radius: 4px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.register:hover {
    background-color: #376D29;
    color: white;
}

.footer {
    margin-top: 3%;
    padding: 50px 0;
    text-align: center;
}

.footer p {
    color: #fff;
    font-size: 17px;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Sans GB", "WenQuanYi","Micro Hei","Verdana, Aril","微软雅黑", sans-serif;
    font-weight: 300;
    line-height: 25px;
}

.footer a,
a:active {
    color: #fff;
    text-decoration: none;
    transition: all 0.5s ease-in-out;
}

.footer a:hover {
    color: #c0392b;
    transition: all 0.5s ease-in-out;
}


/*-- responsive-mediaquries --*/

@media(max-width:1920px) {
    .sign-in {
        margin-left: 78px;
    }
    .reset {
        margin-right: 78px;
    }
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .content div.result p{margin-top: 1%;}
}

@media(max-width:1680px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 65px;
    }
    .reset {
        margin-right: 65px;
    }
}

@media(max-width:1600px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 61px;
    }
    .reset {
        margin-right: 61px;
    }
}

@media (max-width: 1440px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 52px;
    }
    .reset {
        margin-right: 52px;
    }
}

@media (max-width: 1366px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 49px;
    }
    .reset {
        margin-right: 49px;
    }
    .register {
        width: 395px;
    }
}

@media (max-width: 1280px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 43px;
    }
    .reset {
        margin-right: 43px;
    }
    .register {
        width: 373px;
    }
}

@media (max-width: 1080px) {
    .sign-in {
        margin-left: 33px;
    }
    .reset {
        margin-right: 33px;
    }
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    h1 {
        font-size: 40px;
    }
    .log h2,
    .log .content h2 {
        font-size: 35px;
    }
    .register {
        width: 320px;
    }
}

@media (max-width: 1050px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .register {
        width: 315px;
    }
}

@media (max-width: 1024px) {
    .sign-in {
        margin-left: 30px;
    }
    .reset {
        margin-right: 30px;
    }
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .button-row {
        padding: 25px 0;
    }
    .register {
        width: 304px;
    }
    .log h2,
    .log .content h2 {
        font-size: 30px;
        padding: 15px 0;
    }
}

@media (max-width: 991px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .register {
        width: 295px;
    }
}

@media (max-width: 900px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .register {
        width: 274px;
    }
    .button-row {
        padding: 10px 0;
    }
    .sign-in {
        margin-left: 23px;
    }
    .reset {
        margin-right: 23px;
    }
    .content {
        padding: 30px 0 50px;
    }
}

@media (max-width: 800px) {
    .content input[type="text"] {
        font-size: 16px;
    }
    .content input[type="tel"] {
        font-size: 16px;
    }
    .content input[type="email"] {
        font-size: 16px;
    }
    .content input[type="password"] {
        font-size: 16px;
    }
    .content select{
        font-size: 16px;
    }
    .log {
        width: 85%;
    }
    h1 {
        font-size: 35px;
    }
    .log h2,
    .log .content h2 {
        font-size: 27px;
    }
}

@media (max-width: 768px) {
    .sign-in {
        margin-left: 22px;
        font-size: 16px;
    }
    .reset {
        margin-right: 22px;
        font-size: 16px;
    }
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .register {
        width: 270px;
        font-size: 16px;
    }
    .footer p {
        font-size: 16px;
    }
    .log {
        margin: 0 auto 50px;
    }
}

@media (max-width: 736px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .log {
        width: 100%;
    }
    .content {
        width: 63%;
        float: none;
        margin: 50px auto 0;
    }
    h1 {
        padding: 35px 0;
    }
    .sign-in {
        margin-left: 43px;
    }
    .reset {
        margin-right: 43px;
    }
    .register {
        width: 370px;
    }
}

@media (max-width: 667px) {
    .sign-in {
        margin-left: 45px;
        width: 120px;
    }
    .reset {
        margin-right: 45px;
        width: 120px;
    }
    .content {
        width: 70%;
    }
}

@media (max-width: 640px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 41px;
    }
    .reset {
        margin-right: 41px;
    }
    .register {
        width: 82%;
    }
}

@media (max-width: 600px) {
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 37px;
    }
    .reset {
        margin-right: 37px;
    }
    h1 {
        font-size: 30px;
    }
}

@media (max-width: 568px) {
    h1 {
        padding: 25px 0;
    }
    .log h2,
    .log .content h2 {
        font-size: 30px;
        padding: 5px 0 15px;
    }
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 33px;
    }
    .reset {
        margin-right: 33px;
    }
    .register {
        width: 83%;
    }
    .content div.result p{
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .content {
        width: 80%;
    }
    .content input[type="text"] {}
    .content input[type="tel"] {}
    .content input[type="email"] {}
    .content input[type="password"] {}
    .sign-in {
        margin-left: 32px;
    }
    .reset {
        margin-right: 32px;
    }
    .log {
        margin: 0 auto;
    }
    .footer {
        padding: 50px 20px;
    }
    .content div.result p{
        font-size: 14px;
    }
}

@media (max-width:414px) {
    h1 {
        font-size: 28px;
    }
    .log h2,
    .log .content h2 {
        font-size: 27px;
    }
    .sign-in {
        margin-left: 22px;
    }
    .reset {
        margin-right: 22px;
    }
    .register {
        width: 86%;
    }
}

@media (max-width: 384px) {
    .sign-in {
        margin-left: 19px;
    }
    .reset {
        margin-right: 19px;
    }
    .register {
        width: 87%;
    }
}

@media (max-width: 375px) {
    h1 {
        font-size: 26px;
    }
    .log h2,
    .log .content h2 {
        font-size: 25px;
    }
    .content div.result p{
        font-size: 12px;
    }
}

@media (max-width: 320px) {
    h1 {
        font-size: 24px;
    }
    .content input[type="text"] {
        width: 65%;
        font-size: 14px;
    }
    .content input[type="tel"] {
        margin-top: 6%;
        width: 65%;
        font-size: 14px;
    }
    .content input[type="email"] {
        margin-top: 6%;
        width: 65%;
        font-size: 14px;
    }
    .content input[type="password"] {
        margin-top: 6%;
        width: 65%;
        font-size: 14px;
    }
    .content select{
        margin-top: 6%;
        width: 65%;
        font-size: 14px;
    }
    .log h2,
    .log .content h2 {
        font-size: 23px;
    }
    .sign-in,
    .reset {
        font-size: 15px;
        width: 87px;
    }
    .footer p {
        font-size: 14px;
    }
}